<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                template="./index.xhtml"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:f="http://xmlns.jcp.org/jsf/core"
                xmlns:ck="http://code.google.com/ck-jsf-editor">

    <ui:define name="title">
        <title>IDU Đà Nẵng - Tạo câu hỏi</title>
    </ui:define>

    <ui:define name="content">
        <h:form>
            <div class="row" style="margin-top: 20px">
                <label for="questionName" class="col-md-3">
                    Danh mục câu hỏi:
                </label>
                <div class="col-md-4">
                    <h:selectOneMenu value="#{questionManagement.question.category}" 
                                     styleClass="form-control" required="true">
                        <f:converter converterId="categoryConverter" />
                        <f:selectItems value="#{categoryBean.categorys}" var="cate"
                                       itemValue="#{cate}" itemLabel="#{cate.categoryName}" />
                    </h:selectOneMenu> 
                </div>
            </div>
            <div class="row" style="margin-top: 10px">
                <label for="questionName" class="col-md-3">
                    Tên câu hỏi: 
                </label>
                <div class="col-md-9">
                    <h:inputText styleClass="form-control" id="questionName" value="#{questionManagement.question.questionName}"
                                 required="true" requiredMessage="Bạn không được để trống trường này!"
                                 validatorMessage="Tên câu hỏi có độ dài từ 15 tới 105 ký tự">
                        <f:validateLength minimum="15" maximum="105" />
                    </h:inputText>
                </div>
            </div>
            <div class="row" style="margin-top: 10px">
                <label class="col-md-3">
                    Chi tiết câu hỏi:
                </label>
            </div>
            <div class="row" style="margin-top: 10px">
                <div class="col-md-12">
                    <ck:editor id="ckEd" value="#{questionManagement.question.questionDetail}" width="100%"
                               height="300px" />
                </div>
            </div>
            <div class="row" style="margin-top: 10px">
                <div class="col-md-12 text-right">
                    <h:commandButton id="btnRegister" styleClass="btn btn-info" value="Gửi câu hỏi" 
                                     action="#{questionManagement.createQuestion(evt)}" />
                    <h:commandButton styleClass="btn btn-warning" value="Tạo lại" action="#" 
                                     type="reset" style="margin-left: 15px"/>
                </div>
            </div>
            <div class="col-md-4">
                <h:messages id="msg" globalOnly="true" showDetail="true" style="color: red"/>
            </div>
        </h:form>
    </ui:define>

    <ui:define name="right-content">
        right-content
    </ui:define>

</ui:composition>
